<template lang="jade">
	com-alert(:show.sync="alertData.show", :title.sync="alertData.title", :buttontxt.sync="alertData.buttontxt", :content.sync="alertData.content")
	form-page(:url.sync="postBank.url"  , :rdata.sync="postBank.data")
	div.repd
		common-dialog(v-show="showDialog", @update:setparent=" setparent ", :close="true")
			div.redpack
				div.title 可用红包
				div.note 系统会自动为您选择激活红包最大收益的匹配方案，若您想激活其余红包，则需要增加相应的投资金额。
				div.con
					coupon(:items="redlist")

				ul.ux_row(style="padding:5px 10px;font-size:14px;")
					li.ux_flex
						投资金额:
						b.tred {{money}}元
					li.ux_flex
						激活红包:
						b.tred {{redPackData.reward}}元

				ul.ux_row
					li.ux_flex.tcenter
						input.p_btn_nob(type="button", value="充值", @click="goR()")
					li.ux_flex.tcenter
						button(v-bind:class="subBtn.class", v-bind:disabled="subBtn.disabled",   @click="goTender()") {{subBtn.txt}}

	div.return-bar
		i.iconfont(@click="back()") &#xe668;
		还款保障
	div.detail-page.bottom_space.detail_top

		dl.guanrantee-point

			dt 1.抵押物信息
			dd(v-if=" glist.borrow_name_no_type=='1' " )
				div 小区名称：{{glist.cell_name}}
				div 面积：{{glist.area}}
				div 评估价：{{glist.price}}

			dd(v-else)
				div 车辆品牌：{{glist.brand}}
				div 评估价：{{glist.price2}}
				div 车牌号：{{glist.plate_number}}

				div 车辆型号：{{glist.tracel}}
				div 行驶里程：{{glist.car_model}}
				div 上牌时间：{{glist.car_time}}


			dt 2.第三方机构介绍
			dd
				{{{glist.partner}}}

			dt 3.华兴银行存管，平台不接触用户资金。
			dd 采用银行直接存管模式，用户信息和资金全部在华兴银行存管，平台只负责匹配借贷双方信息, 不能动用用户资金。银行全程存管用户资金，提升资金安全，避免了平台跑路、资金池以及资金往来不透明的风险。

			dt 4.还款来源
			dd
				{{{getPayment(glist.payment)}}}


			dt 5.投资人风险情况
			dd
				借款用户逾期还款造成投资者无法按时按约定利率收回本金及收益的风险；

			dt 6.项目风险应对措施
			dd
				{{{getRisk()}}}
				当第三方机构提供的借款项目发生逾期未还款情况，款项将由该机构进行本息足额代偿。为保证代偿承诺顺利实现，第三方机构向有喜财富平台缴纳一定比例的保证金，以保证其履约能力。


			dt 7.合同模板
			dd
				ul.download(v-if=" glist.borrow_name_no_type == 1 " )
					li
						a(href="http://www.uximoney.com/upload/files/loan/1.pdf") 1.借款合同
					li
						a(href="http://www.uximoney.com/upload/files/loan/2.pdf") 2.抵押合同
					li
						a(href="http://www.uximoney.com/upload/files/loan/3.pdf") 3.居间合同
					li
						a(href="http://www.uximoney.com/upload/files/loan/4.pdf") 4.委托书

				ul.download(v-else)
					li
						a(href="http://www.uximoney.com/upload/files/loan/car/1.doc") 1.车贷借款合同担保合同
					li
						a(href="http://www.uximoney.com/upload/files/loan/car/2.doc") 2.车辆抵押合同
					li
						a(href="http://www.uximoney.com/upload/files/loan/car/3.docx") 3.抵押权委托书
					li
						a(href="http://www.uximoney.com/upload/files/loan/car/4.doc") 4.借款担保合同



			dt 8.信息披露
			dd.sp
				ul.imglist.clearfix

					li(v-for= " (index, item) in borrowimg ", style="background: url({{item.img}}) no-repeat center center;background-size:cover;")
						a(@click=" showImg(item.img, index)")
						span {{item.desc}}


		div.viewbox
			dialog(:show.sync="show_dialog")
				i.iconfont.left(@click="prev_pic()") &#xe606;
				i.iconfont.right(@click="next_pic()") &#xe606;
				img.cover(src="{{imgurl}}")
				i.iconfont.close(@click="close_dialog") &#xe629;


		section.form

			div
				div.postForm
					input.money(name="money",v-model="money",placeholder="请输入100的整数倍数，最低100元",autocomplete="off")
					input(type="hidden",name="borrow_nid",v-model="detailId")
					span.rmb 元
					ul.cbox
						li.balance
							span 可用余额￥
								b {{banlance}}
								元
						li.btn
							button(v-bind:class="postBtn.class", v-bind:disabled="postBtn.disabled",  type="button",  @click="onSubmit()") {{postBtn.txt}}

</template>




<script>
import '../../assets/sass/invest/invest.scss'
import {Api_Tender, c_borrow_detail, c_order_detail_guarantee} from '../../config/api'
import {Dialog} from 'vux'
import FormPage from '../../components/common/form'
import ComAlert from '../../components/common/alert'

import api from '../../data/api';
import { mapGetters, mapActions } from 'vuex'
import CommonDialog from "../../components/dialog";  //弹窗插件
import Coupon from "../../components/coupon";
import investOjb from '../../controller/invest';


export default {

	data () {
		return {

			subBtn:{txt:'确认投标',class:'p_btn', disabled:false},
			postBtn:{txt:'立即投标', class:'', disabled:false},
			postForm:{},
			postBank:{
				url:'',
				data:{
					RequestData:'',
					transCode:''
				}
			},
			redlist: [],

            alertData:{
                show:false,
                title:'标题',
                buttontxt:'确定',
                content:'sign'
            },

			busy:false,
			banlance: 0,
			money:'',

			glist: [],
			borrowimg: [],
			title:"",
			//name_no:"",
			imgurl:'',
			show_dialog:false,
			borrow_name_no_type:"",
			pic_index:0,
			borrow_nid:''
		}
	},

	components: {
		Coupon,
		CommonDialog,
		ComAlert,
		FormPage,
		Dialog
	},

    computed: {
      ...mapGetters([
		  'showDialog', 'redPackData'
      ])
	},

	methods: {

		isInteger(obj) {
			return Math.floor(obj) == obj
		},

		verMoney(){
			if(this.money == '') return 0;
			if(this.money == undefined) return 0;
			if(this.money == null) return 0;
			if(this.isInteger(this.money) == false) return 0;
			this.money = parseInt(this.money);
			if(this.money < 100) return 1;
			return 2;
		},

		goR(){
			this.$route.router.go('/recharge_guide');
		},


		setparent(params){
			this.$store.dispatch('setShowDialog', params.status)
		},

		process(key, close){

			if(close){
				this.$store.dispatch('setShowLoading', true), this.busy = true;
			}else{
				this.$store.dispatch('setShowLoading', false), this.busy = false;
			}

			switch (key) {
				case 1:
					if(close){
						this.postBtn.txt = '正在处理', this.postBtn.class = 'grey_btn', this.postBtn.disabled = true;
					}else{
						this.postBtn.txt = '立即投标', this.postBtn.class = '', this.postBtn.disabled = false;
					}
					break;
				case 2:
					if(close){
						this.subBtn.txt = '正在处理', this.subBtn.class = 'grey_btn', this.subBtn.disabled = true;
					}else{
						this.subBtn.txt = '确认投标', this.subBtn.class = 'p_btn', this.subBtn.disabled = false;
					}
					break;
			}
		},

		async goTender(){


			var vm = this;
			if (this.busy) return;

			var am = parseInt(this.money), bm = parseInt(this.redPackData.tender);

			if( am < bm ){
				this.alertData = { show: true, title: '信息提示', buttontxt: '确定', content: '投标金额小于活动条件金额,请重新选择红包!' };
				return;
			}

			var data = {'borrow_nid': this.borrow_nid, 'money': this.money, 'couponArr':this.redPackData.id, 'ajax': '1'}
			this.process(2, true);
			var res = await investOjb.tender(data); //直接投标
			if(res.status == false) this.process(2, false);
		},

		async onSubmit() {
			var vm = this;
			if(this.busy) return;

			var rnum = this.verMoney();
			if(rnum == 0){
				this.alertData = { content: '金额输入有问题,请重新输入!', show: true, title: '信息提示', buttontxt: '确定'};
				return;
			}

			if(rnum == 1){
				this.alertData = { content: '金额请输入大于等于100元以上, 谢谢!', show: true, title: '信息提示', buttontxt: '确定'};
				return;
			}

			var data = {'borrow_nid': this.borrow_nid, 'money': this.money, 'ajax': '1'}
			this.$store.dispatch('setShowLoading', true), this.busy = true;
			this.process(1, true);
			/* var res = await investOjb.getRedPack(data);
			console.log(res)
			if(res.status == false){
				res = await investOjb.tender(data);
				if(res.status == false) this.process(1, false);
			}else{
				this.process(1, false);
			} */

			var res = await investOjb.tender(data);
			if(res.status == false) this.process(1, false);
		},


		back(){
			window.history.back();
		},
		close_dialog(){
			this.show_dialog = !this.show_dialog;
		},
		showImg(url, i){
			console.log('abc');
			this.show_dialog = true;
			this.imgurl = url;
			this.pic_index = i;
		},





		prev_pic(){
			var t_index = this.pic_index - 1;
			if(t_index <  0) t_index = this.borrowimg.length - 1;
			this.imgurl = this.borrowimg[t_index].img;
			this.pic_index = t_index;
		},
		next_pic(){
			var t_index = this.pic_index + 1;
			if(t_index >=  this.borrowimg.length) t_index = 0;
			this.imgurl = this.borrowimg[t_index].img;
			this.pic_index = t_index;
		},
		getRisk(){
			var r_val = ""
			if(this.borrow_name_no_type=='1')
				r_val = "如借款方因故无法偿还，平台将债权转让给第三方机构还款给投资人本金及支付利息。后由第三方机构处置债权。或安排律师通过司法途径申请诉讼借款人以及强制执行处置抵押物，追回借款本金及利息，归还投资人的投资本息。"
			else
				r_val = "当第三方机构提供的借款项目发生逾期未还款情况，款项将由该机构进行本息足额代偿。为保证代偿承诺顺利实现，第三方机构向有喜财富平台缴纳一定比例的保证金，以保证其履约能力。"
			return r_val;
		},
		getPayment(key){
			var r_val = ""
			if(key!=""){
				r_val = key
			}else{
				if(this.borrow_name_no_type=='1')
					r_val = "1.第一还款来源，生意资金周转；<br> 2.第二还款来源，银行贷款；<br> 3.第三还款来源：抵押物变现。"
				else
					r_val = "1、第一还款来源： 借款人工资收入及其他收入。<br> 2、其他还款来源保障：<br>（1）抵押资产处置所得收入；<br>（2）第三方机构代偿。"

			}
			return r_val;
		},

		fetch: function (next) {
			this.$http({url: c_order_detail_guarantee+'&name_no='+this.borrow_nid, method: 'GET'}).then(function (response) {
				this.glist = response.data.data.glist
				this.borrowimg = response.data.data.borrowimg
				this.borrow_name_no_type = this.glist.borrow_name_no_type;
				next()
			});
		},
		getorder: function () {
			var that = this, url = "";

			//if(this.typeId=='1')
				//url = '&name_no='+this.detailId;
			//else
				url = '&borrow_nid='+this.borrow_nid;
				this.$store.dispatch('setShowLoading', true);

			this.$http({url: c_borrow_detail+url, method: 'get'}).then(function (response) {
				this.$store.dispatch('setShowLoading', false);
				that.item = response.data.data
				that.banlance = response.data.banlance
				document.title = that.item.name + " - 有喜财富投标理财"

			}, function (response) {
					console.log(response)
			});
		},

	},
	route: {

		activate ( transition ) {

			document.title = "有喜财富 项目评估报告" ;
			this.borrow_nid = transition.to.params.borrow_nid;
			var that = this;
			this.fetch( function() {
				transition.next();
				that.getorder()
			})

			investOjb.init({eventBus:this});

		}
	}
}
</script>

<style lang="scss" scoped>
.grey_btn{
	background-color:#999!important;
}
</style>


<style lang="scss">
.repd{
	.dialog.active{
		width:95%!important;
	}

	.redpack{
		background-color:#fff;


		.title{
			font-size:16px;
			padding:5px 10px;
		}

		.note{
			font-size:12px;
			margin-bottom:10px;
			padding:0px 10px;
		}
		.con{
			background-color:#f4f8fb;
			padding:10px;
			padding-bottom:1px;
			height: 200px;
    		overflow-y: scroll;
		}

		.ux_flex{
			padding:5px 0px;
		}
		input, button{
			width:80%;
			padding:8px 0px;
			font-size:14px;
			&.p_btn{
				border:none;
			}
			&.grey_btn{
				color:#fff;
				border:none;
				border-radius: .1rem;
				background-color:#999!important;
			}

		}

		.coupon li .tag span{
			font-size:14px;
		}
		.coupon li .tag strong{
			    font-size: 16px;
		}
		.coupon li .info{
			width:56%;
		}
	}
}
</style>
